<template name="components">
	<scroll-view scroll-y class="page">
		<image src="https://hafcapp.oss-cn-shanghai.aliyuncs.com/cs/select_company.png?Expires=1868637600&OSSAccessKeyId=LTAIA9VLEk1xfvBJ&Signature=cW4KPUjNAWjw35TCgABwL4ccYDc%3D" mode="widthFix" class="response"></image>
		<view class="nav-list">
			<view @click="itemClick(item)" hover-class='none' class="nav-li" :class="'bg-'+item.color" :style="[{animation: 'show ' + ((index+1)*0.2+1) + 's 1'}]"
			 v-for="(item,index) in elements" :key="index">
				<view class="nav-title">{{item.title}}</view>
				<!-- <view class="nav-name">{{item.name}}</view> -->
				<!-- <text :class="'cuIcon-' + item.cuIcon"></text> -->
			</view>
			<view v-show="isEmpty" class="text-lg">
				<text class="text-black text-bold">{{i18n.user}} "{{phone}}" {{i18n.tips}}</text>
			</view>
		</view>
		<view class="cu-tabbar-height"></view>
	</scroll-view>
</template>

<script>
	var _self = null
	export default {
		computed: {
			i18n() {
				return this.$t('selectCompany')
			},
		},
		data() {
			return {
				elements: [],
				isEmpty: false,
				phone:''
			};
		},
		onLoad(options) {
			_self = this
			options = options
			console.log(options)
			if (typeof(options.company) != 'undefined') {
				try {
					let data = JSON.parse(options.company)
					let company = data.departlist
					_self.phone = data.phone
					// console.log('company object = ', company)
					if (company == '' || company.length == 0) {
						_self.isEmpty = true
						return
					}
					company.forEach((item, index) => {
						var color = ''
						switch (index % 7) {
							case 0:
								color = 'purple'
								break;
							case 1:
								color = 'mauve'
								break;
							case 2:
								color = 'pink'
								break;
							case 3:
								color = 'brown'
								break;
							case 4:
								color = 'red'
								break;
							case 5:
								color = 'purple'
								break;
							case 6:
								color = 'orange'
								break;
							case 7:
								color = 'green'
								break;
							default:
								color = 'purple'
								break;
						}
						let card = {
							title: item.departname,
							name: 'bar',
							color: color,
							cuIcon: 'vipcard',
							userid: item.userid,
							id: item.id,
							unitno:item.unitno
						}
						_self.elements.push(card)
					});
				} catch (e) {
					_self.isEmpty = true
				}
			} else {
				_self.isEmpty = true
			}
		},
		methods: {
			itemClick(item) {
				console.log(item)
				uni.request({
					url: _self.$constant.BASEURL + _self.$constant.SELECT_COMPANY,
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						id: item.id,
						userid: item.userid
					},
					success: (res) => {
						//跳转到首页
						let result = res.data
						console.log(result)
						if (result.code == 0) {
							getApp().globalData.unitno = item.unitno
							getApp().globalData.userid = item.userid
							this.$constant.saveUserid(item.userid)
							this.$constant.saveUnitno(item.unitno)
							uni.switchTab({
								url: '../index/index'
							});
						} else {
							uni.showToast({
								title: result.message,
								icon: 'none'
							})
						}
					},
					fail() {
						uni.showToast({
							title: _self.$t('netErrors'),
							icon: 'none'
						})
					}
				});
			}
		}
	}
</script>

<style>
	.page {
		height: 100vh;
	}
</style>
